<!DOCTYPE html>
<html  lang="zh">
<head>
    <!-- hexo-inject:begin --><!-- hexo-inject:end --><meta charset="utf-8" />

<meta name="generator" content="Hexo 3.9.0" />

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

<title>mmorpg网络游戏学习2-地图场景 - 游戏人生</title>


    <meta name="description" content="学习状态同步的概念">
<meta name="keywords" content="game">
<meta property="og:type" content="article">
<meta property="og:title" content="mmorpg网络游戏学习2-地图场景">
<meta property="og:url" content="http://cloundgame.gitee.io/mystudy/2019/08/18/mmorgp-pomelo-unity-2/index.html">
<meta property="og:site_name" content="游戏人生">
<meta property="og:description" content="学习状态同步的概念">
<meta property="og:locale" content="zh-CN">
<meta property="og:image" content="http://cloundgame.gitee.io/mystudy/images/og_image.png">
<meta property="og:updated_time" content="2020-08-05T08:06:20.874Z">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="mmorpg网络游戏学习2-地图场景">
<meta name="twitter:description" content="学习状态同步的概念">
<meta name="twitter:image" content="http://cloundgame.gitee.io/mystudy/images/og_image.png">







<link rel="icon" href="/mystudy/images/favicon.svg">


<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.7.2/css/bulma.css">
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/font-awesome/5.9.0/css/all.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Ubuntu:400,600|Source+Code+Pro">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/highlight.js@9.12.0/styles/atom-one-dark.css">


    
    
    
    <style>body>.footer,body>.navbar,body>.section{opacity:0}</style>
    

    
    
    
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/lightgallery@1.6.8/dist/css/lightgallery.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/justifiedGallery@3.7.0/dist/css/justifiedGallery.min.css">
    

    
    

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/outdatedbrowser@1.1.5/outdatedbrowser/outdatedbrowser.min.css">


    
    
    
    

<link rel="stylesheet" href="/mystudy/css/back-to-top.css">


    
    

    
    
    
    

    
    
<link rel="stylesheet" href="/mystudy/css/progressbar.css">
<script src="https://cdn.jsdelivr.net/npm/pace-js@1.0.2/pace.min.js"></script>

    
    
    
        <script async="" src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
    

    


<link rel="stylesheet" href="/mystudy/css/style.css"><!-- hexo-inject:begin --><!-- hexo-inject:end -->
</head>
<body class="is-3-column">
    <!-- hexo-inject:begin --><!-- hexo-inject:end --><nav class="navbar navbar-main">
    <div class="container">
        <div class="navbar-brand is-flex-center">
            <a class="navbar-item navbar-logo" href="/mystudy/">
            
                <img src="/mystudy/images/logo.svg" alt="mmorpg网络游戏学习2-地图场景" height="28">
            
            </a>
        </div>
        <div class="navbar-menu">
            
            <div class="navbar-start">
                
                <a class="navbar-item"
                href="/mystudy/">主页</a>
                
                <a class="navbar-item"
                href="/mystudy/archives">日志</a>
                
                <a class="navbar-item"
                href="/mystudy/categories">分类</a>
                
                <a class="navbar-item"
                href="/mystudy/">关于</a>
                
            </div>
            
            <div class="navbar-end">
                
                    
                    
                    <a class="navbar-item" target="_blank" title="Download on GitHub" href="https://github.com/koliy/koliy.github.io">
                        
                        <i class="fab fa-github"></i>
                        
                    </a>
                    
                
                
                <a class="navbar-item is-hidden-tablet catalogue" title="目录" href="javascript:;">
                    <i class="fas fa-list-ul"></i>
                </a>
                
                
                <a class="navbar-item search" title="搜索" href="javascript:;">
                    <i class="fas fa-search"></i>
                </a>
                
            </div>
        </div>
    </div>
</nav>
    
    <section class="section">
        <div class="container">
            <div class="columns">
                <div class="column is-8-tablet is-8-desktop is-6-widescreen has-order-2 column-main"><div class="card">
    
    <div class="card-content article ">
        
        <div class="level article-meta is-size-7 is-uppercase is-mobile is-overflow-x-auto">
            <div class="level-left">
                <time class="level-item has-text-grey" datetime="2019-08-17T20:20:16.000Z">2019-08-18</time>
                
                <div class="level-item">
                <a class="has-link-grey -link" href="/mystudy/categories/网络同步/">网络同步</a>
                </div>
                
                
                <span class="level-item has-text-grey">
                    
                    
                    12 分钟 读完 (大约 1811 个字)
                </span>
                
                
                <span class="level-item has-text-grey" id="busuanzi_container_page_pv">
                    <i class="far fa-eye"></i>
                    <span id="busuanzi_value_page_pv">0</span>次访问
                </span>
                
            </div>
        </div>
        
        <h1 class="title is-size-3 is-size-4-mobile has-text-weight-normal">
            
                mmorpg网络游戏学习2-地图场景
            
        </h1>
        <div class="content">
            <p><strong><a href="https://koliy.github.io/2019/08/17/mmorgp-pomelo-unity-1/" target="_blank" rel="noopener">查看总结篇获取资源下载</a></strong></p>
<h3 id="前言"><a href="#前言" class="headerlink" title="前言:"></a><strong>前言:</strong></h3><p>这章主要讲下，一个地图元素，我们要怎样才能切割出它在地图上所占的区域tile。<br>毕竟不能死板的读取配置文件的二维数组数据来配置tile。这对于2000x4000,8000等大地图来说，让人去提供每个元素这些[][]=[1,0…]实在是不现实。<br>这里的思路是：<br>根据元素的多边形顶点，程序计算出此元素的所占区域tile。这样只需要美术提供对应元素在地图上的多边形顶点像素坐标即可配置文件了。<br><img src="unity3.png" alt></p>
<h3 id="对多边形区域划分tille"><a href="#对多边形区域划分tille" class="headerlink" title="对多边形区域划分tille"></a><strong>对多边形区域划分tille</strong></h3><p>有了多边形的顶点元素坐标，那么怎么计算出在多边形区域内的tille和每条边所占的tile了?</p>
<a id="more"></a>

<h3 id="几何算法"><a href="#几何算法" class="headerlink" title="几何算法"></a><strong>几何算法</strong></h3><p>有了多边形的顶点元素坐标，那么怎么计算出在多边形区域内的tille和每条边所占的tile了?<br>我们需要使用到几何算法了。</p>
<h4 id="点是否在直线上"><a href="#点是否在直线上" class="headerlink" title="点是否在直线上"></a><strong>点是否在直线上</strong></h4><p>原理：<br>1.叉乘: P1Q x P1P2 = 0<br>2.点Q要在以P1，P2为对角线的平行矩形内，确定点Q是否同向</p>
<p>叉乘可以表示3点的位置关系：<br>AB x AC &gt; 0 :AC在AB的逆时针方向<br>AB x AC &lt; 0 :AC在AB的顺时针方向<br>AB x AC = 0 :ABC 3点共线，可能同向也可能反向</p>
<p>判断 某一点在直线左右侧</p>
<p>方法一：<br>左右方向是相对前进方向的,只要指定了前进方向就可以知道左右(比如指定前进方向是从直线的起点到终点).判断点在直线的左侧还是右侧是计算几何里面的一个最基本算法.使用矢量来判断.<br>定义：平面上的三点P1(x1,y1),P2(x2,y2),P3(x3,y3)的面积量：<br>(P1-P3,P2-P3) = (P1-P3,P2-P1)<br>结果一样，都是求P3点</p>
<p>S(P1,P2,P3)=|y1 y2 y3|= (x1-x3)<em>(y2-y3)-(y1-y3)</em>(x2-x3)</p>
<p>当P1P2P3逆时针时S为正的，当P1P2P3顺时针时S为负的。</p>
<p>令矢量的起点为A，终点为B，判断的点为C，<br>如果S（A，B，C）为正数，则C在矢量AB的左侧；<br>如果S（A，B，C）为负数，则C在矢量AB的右侧；<br>如果S（A，B，C）为0，则C在直线AB上。<br>方法二：</p>
<p>它可以用来判断点在直线的某侧。进而可以解决点是否在三角形内，两个矩形是否重叠等问题。向量的叉积的模表示这两个向量围成的平行四边形的面积。<br>设矢量P = ( x1, y1 )，Q = ( x2, y2 )，则矢量叉积定义为由(0,0)、p1、p2和p1+p2所组成的平行四边形的带符号的面积，即：P×Q = x1<em>y2 - x2</em>y1，其结果是一个伪矢量。<br>显然有性质 P × Q = - ( Q × P ) 和 P × ( - Q ) = - ( P × Q )。<br>叉积的一个非常重要性质是可以通过它的符号判断两矢量相互之间的顺逆时针关系：<br>若 P × Q &gt; 0 , 则P在Q的顺时针方向。<br>若 P × Q &lt; 0 , 则P在Q的逆时针方向。<br>若 P × Q = 0 , 则P与Q共线，但可能同向也可能反向。<br>叉积的方向与进行叉积的两个向量都垂直，所以叉积向量即为这两个向量构成平面的法向量。<br>如果向量叉积为零向量，那么这两个向量是平行关系。</p>
<p>因为向量叉积是这两个向量平面的法向量，如果两个向量平行无法形成一个平面，其对应也没有平面法向量。所以，两个向量平行时，其向量叉积为零</p>
<figure class="highlight javascript hljs"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line">exp.isOnline = <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">pos,p1,p2</span>)</span>&#123;</span><br><span class="line">	<span class="hljs-keyword">var</span> v1 = &#123;<span class="hljs-attr">x</span>:pos.x -p1.x,<span class="hljs-attr">y</span>:pos.y - p1.y&#125;; <span class="hljs-comment">//AC -&gt; p1pos</span></span><br><span class="line">	<span class="hljs-keyword">var</span> v2 = &#123;<span class="hljs-attr">x</span>: p2.x -p1.x,<span class="hljs-attr">y</span>:p2.y - p1.y&#125;; <span class="hljs-comment">//AB-&gt; p1p2</span></span><br><span class="line">	</span><br><span class="line">	<span class="hljs-keyword">if</span>((v1.x * v2.y - v2.x * v1.y) === <span class="hljs-number">0</span>)&#123; <span class="hljs-comment">//AB x AC  = 0,2个向量叉积计算</span></span><br><span class="line">		<span class="hljs-keyword">if</span>(pos.y &gt;= <span class="hljs-built_in">Math</span>.min(p1.y,p2.y) &amp;&amp; pos.y &lt;= <span class="hljs-built_in">Math</span>.max(p1.y,p2.y) &amp;&amp; <span class="hljs-comment">//点在对角线矩形内，因为可能同向也可能反向。</span></span><br><span class="line">		 pos.x &gt;= <span class="hljs-built_in">Math</span>.min(p1.x,p2.x) &amp;&amp; pos.x&lt;= <span class="hljs-built_in">Math</span>.max(p1.x,p2.x))</span><br><span class="line">			<span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;</span><br><span class="line">		</span><br><span class="line">		<span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;</span><br><span class="line">	&#125;</span><br><span class="line">	</span><br><span class="line">	<span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;</span><br><span class="line">&#125;;</span><br></pre></td></tr></table></figure>

<h4 id="线段相交"><a href="#线段相交" class="headerlink" title="线段相交"></a><strong>线段相交</strong></h4><p>线段相交分3种情况：<br>1.2线段不重合，正常相交<br>2.只有1点相交，A，C点，相交重合在一起。<br>3.2线段重合</p>
<p>原理:<br>1.判断以2条线段的为对角线的矩形是否相交，如果不相交则线段必然不相交。<br>2.互相跨立：利用矢量叉乘判断两条线段是否相互跨越，如果相互跨越显然就相交，反之则不相交</p>
<figure class="highlight javascript hljs"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br></pre></td><td class="code"><pre><span class="line">exp.isIntersect = <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">p1,p2,q1,q2</span>)</span>&#123;</span><br><span class="line">	<span class="hljs-comment">// 快速排斥：首先判断以两条线段为对角线的矩形是否相交，如果不相交两条线段肯定也不相交。</span></span><br><span class="line">	<span class="hljs-keyword">if</span>(!<span class="hljs-keyword">this</span>.isRectIntersect(p1,p2,q1,q2)) <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;</span><br><span class="line">	</span><br><span class="line">	<span class="hljs-comment">//互相跨立：利用矢量叉乘判断两条线段是否相互跨越，如果相互跨越显然就相交，反之则不相交</span></span><br><span class="line">	<span class="hljs-keyword">var</span> v1 = &#123;<span class="hljs-attr">x</span>:(p1.x - q1.x), <span class="hljs-attr">y</span>:(p1.y - q1.y)&#125;;</span><br><span class="line">	<span class="hljs-keyword">var</span> v2 = &#123;<span class="hljs-attr">x</span>:(q2.x - q1.x), <span class="hljs-attr">y</span>:(q2.y - q1.y)&#125;;</span><br><span class="line">	<span class="hljs-keyword">var</span> v3 = &#123;<span class="hljs-attr">x</span>:(p2.x - q1.x), <span class="hljs-attr">y</span>:(p2.y - q1.y)&#125;;</span><br><span class="line">	</span><br><span class="line">	<span class="hljs-keyword">if</span>(<span class="hljs-keyword">this</span>.vecCross(v1,v2) * <span class="hljs-keyword">this</span>.vecCross(v2,v3) &gt; <span class="hljs-number">0</span>) <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;</span><br><span class="line">	</span><br><span class="line">	<span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;</span><br><span class="line">	</span><br><span class="line">&#125;;</span><br><span class="line"></span><br><span class="line"><span class="hljs-comment">/**</span></span><br><span class="line"><span class="hljs-comment"> * 2个向量叉积</span></span><br><span class="line"><span class="hljs-comment"> * @param v1</span></span><br><span class="line"><span class="hljs-comment"> * @param v2</span></span><br><span class="line"><span class="hljs-comment"> * @returns &#123;number&#125;</span></span><br><span class="line"><span class="hljs-comment"> */</span></span><br><span class="line">exp.vecCross = <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">v1,v2</span>)</span>&#123;</span><br><span class="line">	<span class="hljs-keyword">return</span> v1.x * v2.y - v2.x * v1.y;</span><br><span class="line">&#125;;</span><br></pre></td></tr></table></figure>

<h4 id="矩形相交"><a href="#矩形相交" class="headerlink" title="矩形相交"></a><strong>矩形相交</strong></h4><p>原理:<br>判断2个矩形是否相交，只需要判断它们相交内的形成的矩形左上顶点和右下顶点是否满足</p>
<figure class="highlight javascript hljs"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">minx&lt;= maxx &amp;&amp; miny &lt;= maxy</span><br></pre></td></tr></table></figure>

<p>满足此条件则相交成立。</p>
<figure class="highlight javascript hljs"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><span class="line">exp.isRectIntersect = <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">p1,p2,q1,q2</span>)</span>&#123;</span><br><span class="line">	<span class="hljs-comment">//计算P,Q矩形的左上顶点和右下顶点</span></span><br><span class="line">	<span class="hljs-keyword">var</span> minP = &#123;<span class="hljs-attr">x</span>:p1.x&lt;p2.x?p1.x:p2.x, <span class="hljs-attr">y</span>:p1.y&lt;p2.y?p1.y:p2.y&#125;;</span><br><span class="line">	<span class="hljs-keyword">var</span> maxP = &#123;<span class="hljs-attr">x</span>:p1.x&gt;p2.x?p1.x:p2.x, <span class="hljs-attr">y</span>:p1.y&gt;p2.y?p1.y:p2.y&#125;;</span><br><span class="line">	<span class="hljs-keyword">var</span> minQ = &#123;<span class="hljs-attr">x</span>:q1.x&lt;q2.x?q1.x:q2.x, <span class="hljs-attr">y</span>:q1.y&lt;q2.y?q1.y:q2.y&#125;;</span><br><span class="line">	<span class="hljs-keyword">var</span> maxQ = &#123;<span class="hljs-attr">x</span>:q1.x&gt;q2.x?q1.x:q2.x, <span class="hljs-attr">y</span>:q1.y&gt;q2.y?q1.y:q2.y&#125;;</span><br><span class="line">	</span><br><span class="line">	<span class="hljs-comment">//计算2个矩形相交内的矩形面积形成的矩形左上顶点和右下顶点，满足 minx&lt;= maxx &amp;&amp; miny &lt;= maxy则相交</span></span><br><span class="line">	<span class="hljs-keyword">var</span> minx = <span class="hljs-built_in">Math</span>.max(minP.x,minQ.x);</span><br><span class="line">	<span class="hljs-keyword">var</span> miny = <span class="hljs-built_in">Math</span>.max(minP.y,minQ.y);</span><br><span class="line">	<span class="hljs-keyword">var</span> maxx = <span class="hljs-built_in">Math</span>.min(maxP.x,maxQ.x);</span><br><span class="line">	<span class="hljs-keyword">var</span> maxy = <span class="hljs-built_in">Math</span>.min(maxP.y,maxQ.y);</span><br><span class="line">	</span><br><span class="line">	<span class="hljs-keyword">return</span> !(minx &gt; maxx || miny &gt;maxy);</span><br><span class="line">&#125;;</span><br></pre></td></tr></table></figure>

<h4 id="点是否在多边形内"><a href="#点是否在多边形内" class="headerlink" title="点是否在多边形内"></a><strong>点是否在多边形内</strong></h4><p>根据上面算法，就可以判断出tile是否在多边形里面了。<br>这里的思路是：<br>1.先计算出包裹住多边形的矩形大小，如图，红色线框<br><img src="unity4.png" alt></p>
<p>2.计算出在这红色线框内的所有tileA。<br>3.对每个tileA又切割成田字形的4个小tileB。<br>4.以每个小tileB的中点，判断是否处于多边形内，只要有一个点成立，则此tileA是在多边形内.</p>
<figure class="highlight javascript hljs"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br></pre></td><td class="code"><pre><span class="line">exp.isInPolygon = <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">pos,polygon</span>)</span>&#123;</span><br><span class="line">	<span class="hljs-keyword">var</span> p = &#123;<span class="hljs-attr">x</span>:<span class="hljs-number">10000000</span>,<span class="hljs-attr">y</span>:pos.y&#125;;</span><br><span class="line">	<span class="hljs-keyword">var</span> count = <span class="hljs-number">0</span>;</span><br><span class="line">	</span><br><span class="line">	<span class="hljs-keyword">for</span>(<span class="hljs-keyword">var</span> i=<span class="hljs-number">0</span>;i&lt;polygon.length;i++)&#123;</span><br><span class="line">		<span class="hljs-keyword">var</span> p1 = polygon[i];</span><br><span class="line">		<span class="hljs-keyword">var</span> p2 = polygon[(i+<span class="hljs-number">1</span>) % polygon.length];</span><br><span class="line">		</span><br><span class="line">		<span class="hljs-keyword">if</span>(<span class="hljs-keyword">this</span>.isOnline(pos,p1,p2)) <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;</span><br><span class="line">		<span class="hljs-comment">//当前点和多边形的每条边都比较一次。</span></span><br><span class="line">		<span class="hljs-keyword">if</span>(p1.y !== p2.y)&#123;</span><br><span class="line">			<span class="hljs-keyword">if</span>(<span class="hljs-keyword">this</span>.isOnline(p1,pos,p))&#123;</span><br><span class="line">				<span class="hljs-keyword">if</span>(p1.y &gt; p2.y) &#123;</span><br><span class="line">					count++;</span><br><span class="line">					<span class="hljs-keyword">continue</span>;</span><br><span class="line">				&#125;</span><br><span class="line">			&#125;<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-keyword">this</span>.isOnline(p2,pos,p))&#123;</span><br><span class="line">				<span class="hljs-keyword">if</span>(p2.y &gt; p1.y)&#123;</span><br><span class="line">					count++;</span><br><span class="line">					<span class="hljs-keyword">continue</span>;</span><br><span class="line">				&#125;</span><br><span class="line">			&#125;<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-keyword">this</span>.isIntersect(pos,p,p1,p2))&#123;</span><br><span class="line">				count++;</span><br><span class="line">				<span class="hljs-keyword">continue</span>;</span><br><span class="line">			&#125;</span><br><span class="line">		&#125;</span><br><span class="line">	&#125;</span><br><span class="line">	</span><br><span class="line">	<span class="hljs-keyword">if</span>(count % <span class="hljs-number">2</span> === <span class="hljs-number">1</span>) <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;</span><br><span class="line">	</span><br><span class="line">	<span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;</span><br><span class="line">	</span><br><span class="line">&#125;;</span><br></pre></td></tr></table></figure>


        </div>
        
        <div class="level is-size-7 is-uppercase">
            <div class="level-start">
                <div class="level-item">
                    <span class="is-size-6 has-text-grey has-mr-7">#</span>
                    <a class="has-link-grey -link" href="/mystudy/tags/game/">game</a>
                </div>
            </div>
        </div>
        
        

        
        <div class="social-share"></div>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/social-share.js@1.0.16/dist/css/share.min.css">
<script src="https://cdn.jsdelivr.net/npm/social-share.js@1.0.16/dist/js/social-share.min.js"></script>
        
    </div>
</div>





<div class="card card-transparent">
    <div class="level post-navigation is-flex-wrap is-mobile">
        
        <div class="level-start">
            <a class="level level-item has-link-grey  article-nav-prev" href="/mystudy/2019/08/18/mmorpg-pomelo-unity-3/">
                <i class="level-item fas fa-chevron-left"></i>
                <span class="level-item">mmorpg网络游戏学习3-A*寻路路径优化</span>
            </a>
        </div>
        
        
        <div class="level-end">
            <a class="level level-item has-link-grey  article-nav-next" href="/mystudy/2019/08/17/mmorgp-pomelo-unity-1/">
                <span class="level-item">mmorpg网络游戏学习1-总结</span>
                <i class="level-item fas fa-chevron-right"></i>
            </a>
        </div>
        
    </div>
</div>


</div>
                




<div class="column is-4-tablet is-4-desktop is-3-widescreen  has-order-1 column-left ">
    
        
<div class="card widget">
    <div class="card-content">
        <nav class="level">
            <div class="level-item has-text-centered" style="flex-shrink: 1">
                <div>
                    
                        <img class="image is-128x128 has-mb-6" src="/mystudy/images/avatar2.jpg" alt="满头大汉老黄牛">
                    
                    
                    <p class="is-size-4 is-block">
                        满头大汉老黄牛
                    </p>
                    
                    
                    <p class="is-size-6 is-block">
                        游戏
                    </p>
                    
                    
                    <p class="is-size-6 is-flex is-flex-center has-text-grey">
                        <i class="fas fa-map-marker-alt has-mr-7"></i>
                        <span>火星</span>
                    </p>
                    
                </div>
            </div>
        </nav>
        <nav class="level is-mobile">
            <div class="level-item has-text-centered is-marginless">
                <div>
                    <p class="heading">
                        文章
                    </p>
                    <p class="title has-text-weight-normal">
                        70
                    </p>
                </div>
            </div>
            <div class="level-item has-text-centered is-marginless">
                <div>
                    <p class="heading">
                        分类
                    </p>
                    <p class="title has-text-weight-normal">
                        10
                    </p>
                </div>
            </div>
            <div class="level-item has-text-centered is-marginless">
                <div>
                    <p class="heading">
                        标签
                    </p>
                    <p class="title has-text-weight-normal">
                        3
                    </p>
                </div>
            </div>
        </nav>
        <div class="level">
            <a class="level-item button is-link is-rounded" href="https://github.com/koliy/" target="_blank">
                关注我</a>
        </div>
        
        
        <div class="level is-mobile">
            
            <a class="level-item button is-white is-marginless" target="_blank"
                title="Github" href="https://github.com/koliy/">
                
                <i class="fab fa-github"></i>
                
            </a>
            
        </div>
        
    </div>
</div>
    
        


    
        
<div class="card widget">
    <div class="card-content">
        <div class="menu">
            <h3 class="menu-label">
                分类
            </h3>
            <ul class="menu-list">
            <li>
        <a class="level is-marginless" href="/mystudy/categories/3D数学基础-图形与游戏开发/">
            <span class="level-start">
                <span class="level-item">3D数学基础:图形与游戏开发</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">3</span>
            </span>
        </a></li><li>
        <a class="level is-marginless" href="/mystudy/categories/AI/">
            <span class="level-start">
                <span class="level-item">AI</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">12</span>
            </span>
        </a></li><li>
        <a class="level is-marginless" href="/mystudy/categories/MySql/">
            <span class="level-start">
                <span class="level-item">MySql</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">1</span>
            </span>
        </a></li><li>
        <a class="level is-marginless" href="/mystudy/categories/SurfaceShader/">
            <span class="level-start">
                <span class="level-item">SurfaceShader</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">1</span>
            </span>
        </a></li><li>
        <a class="level is-marginless" href="/mystudy/categories/Unity/">
            <span class="level-start">
                <span class="level-item">Unity</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">1</span>
            </span>
        </a></li><li>
        <a class="level is-marginless" href="/mystudy/categories/git/">
            <span class="level-start">
                <span class="level-item">git</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">3</span>
            </span>
        </a></li><li>
        <a class="level is-marginless" href="/mystudy/categories/shade学习/">
            <span class="level-start">
                <span class="level-item">shade学习</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">33</span>
            </span>
        </a></li><li>
        <a class="level is-marginless" href="/mystudy/categories/xlua/">
            <span class="level-start">
                <span class="level-item">xlua</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">1</span>
            </span>
        </a></li><li>
        <a class="level is-marginless" href="/mystudy/categories/网络同步/">
            <span class="level-start">
                <span class="level-item">网络同步</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">10</span>
            </span>
        </a></li><li>
        <a class="level is-marginless" href="/mystudy/categories/设计模式/">
            <span class="level-start">
                <span class="level-item">设计模式</span>
            </span>
            <span class="level-end">
                <span class="level-item tag">5</span>
            </span>
        </a></li>
            </ul>
        </div>
    </div>
</div>
    
        <div class="card widget">
    <div class="card-content">
        <div class="menu">
        <h3 class="menu-label">
            归档
        </h3>
        <ul class="menu-list">
        
        <li>
            <a class="level is-marginless" href="/mystudy/archives/2020/09/">
                <span class="level-start">
                    <span class="level-item">九月 2020</span>
                </span>
                <span class="level-end">
                    <span class="level-item tag">1</span>
                </span>
            </a>
        </li>
        
        <li>
            <a class="level is-marginless" href="/mystudy/archives/2020/07/">
                <span class="level-start">
                    <span class="level-item">七月 2020</span>
                </span>
                <span class="level-end">
                    <span class="level-item tag">23</span>
                </span>
            </a>
        </li>
        
        <li>
            <a class="level is-marginless" href="/mystudy/archives/2020/06/">
                <span class="level-start">
                    <span class="level-item">六月 2020</span>
                </span>
                <span class="level-end">
                    <span class="level-item tag">17</span>
                </span>
            </a>
        </li>
        
        <li>
            <a class="level is-marginless" href="/mystudy/archives/2020/03/">
                <span class="level-start">
                    <span class="level-item">三月 2020</span>
                </span>
                <span class="level-end">
                    <span class="level-item tag">2</span>
                </span>
            </a>
        </li>
        
        <li>
            <a class="level is-marginless" href="/mystudy/archives/2020/02/">
                <span class="level-start">
                    <span class="level-item">二月 2020</span>
                </span>
                <span class="level-end">
                    <span class="level-item tag">4</span>
                </span>
            </a>
        </li>
        
        <li>
            <a class="level is-marginless" href="/mystudy/archives/2019/09/">
                <span class="level-start">
                    <span class="level-item">九月 2019</span>
                </span>
                <span class="level-end">
                    <span class="level-item tag">5</span>
                </span>
            </a>
        </li>
        
        <li>
            <a class="level is-marginless" href="/mystudy/archives/2019/08/">
                <span class="level-start">
                    <span class="level-item">八月 2019</span>
                </span>
                <span class="level-end">
                    <span class="level-item tag">18</span>
                </span>
            </a>
        </li>
        
        </ul>
        </div>
    </div>
</div>
    
        
<div class="card widget">
    <div class="card-content">
        <h3 class="menu-label">
            标签云
        </h3>
        <a href="/mystudy/tags/game/" style="font-size: 15px;">game</a> <a href="/mystudy/tags/git/" style="font-size: 10px;">git</a> <a href="/mystudy/tags/学习/" style="font-size: 20px;">学习</a>
    </div>
</div>

    
    
        <div class="column-right-shadow is-hidden-widescreen is-sticky">
        
            
<div class="card widget" id="toc">
    <div class="card-content">
        <div class="menu">
            <h3 class="menu-label">
                目录
            </h3>
            <ul class="menu-list"><li>
        <a class="is-flex" href="#前言">
        <span class="has-mr-6">1</span>
        <span>前言:</span>
        </a></li><li>
        <a class="is-flex" href="#对多边形区域划分tille">
        <span class="has-mr-6">2</span>
        <span>对多边形区域划分tille</span>
        </a></li><li>
        <a class="is-flex" href="#几何算法">
        <span class="has-mr-6">3</span>
        <span>几何算法</span>
        </a><ul class="menu-list"><li>
        <a class="is-flex" href="#点是否在直线上">
        <span class="has-mr-6">3.1</span>
        <span>点是否在直线上</span>
        </a></li><li>
        <a class="is-flex" href="#线段相交">
        <span class="has-mr-6">3.2</span>
        <span>线段相交</span>
        </a></li><li>
        <a class="is-flex" href="#矩形相交">
        <span class="has-mr-6">3.3</span>
        <span>矩形相交</span>
        </a></li><li>
        <a class="is-flex" href="#点是否在多边形内">
        <span class="has-mr-6">3.4</span>
        <span>点是否在多边形内</span>
        </a></li></ul></li></ul>
        </div>
    </div>
</div>

        
        </div>
    
</div>

                




<div class="column is-4-tablet is-4-desktop is-3-widescreen is-hidden-touch is-hidden-desktop-only has-order-3 column-right is-sticky">
    
        
<div class="card widget" id="toc">
    <div class="card-content">
        <div class="menu">
            <h3 class="menu-label">
                目录
            </h3>
            <ul class="menu-list"><li>
        <a class="is-flex" href="#前言">
        <span class="has-mr-6">1</span>
        <span>前言:</span>
        </a></li><li>
        <a class="is-flex" href="#对多边形区域划分tille">
        <span class="has-mr-6">2</span>
        <span>对多边形区域划分tille</span>
        </a></li><li>
        <a class="is-flex" href="#几何算法">
        <span class="has-mr-6">3</span>
        <span>几何算法</span>
        </a><ul class="menu-list"><li>
        <a class="is-flex" href="#点是否在直线上">
        <span class="has-mr-6">3.1</span>
        <span>点是否在直线上</span>
        </a></li><li>
        <a class="is-flex" href="#线段相交">
        <span class="has-mr-6">3.2</span>
        <span>线段相交</span>
        </a></li><li>
        <a class="is-flex" href="#矩形相交">
        <span class="has-mr-6">3.3</span>
        <span>矩形相交</span>
        </a></li><li>
        <a class="is-flex" href="#点是否在多边形内">
        <span class="has-mr-6">3.4</span>
        <span>点是否在多边形内</span>
        </a></li></ul></li></ul>
        </div>
    </div>
</div>

    
    
</div>

            </div>
        </div>
    </section>
    <footer class="footer">
    <div class="container1">
        <div class="level1">
            <div class="level-start1 has-text-centered-mobile1">
                <a class="footer-logo is-block has-mb-6" href="/mystudy/">
                

                
                </a>
                <p class="is-size-7">
                &copy; 2020 Koliy&nbsp;
                Powered by <a href="https://github.com/koliy/koliy.github.io" target="_blank">Hexo</a> & <a
                        href="https://github.com/ppoffice/hexo-theme-icarus" target="_blank">Icarus</a>
                
                <br>
                <span id="busuanzi_container_site_uv">
                共<span id="busuanzi_value_site_uv">0</span>个访客
                </span>
                
                </p>
            </div>
            <div class="level-end1">
            
            </div>
        </div>
    </div>
</footer>
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/moment@2.22.2/min/moment-with-locales.min.js"></script>
<script>moment.locale("zh-CN");</script>

<script>
var IcarusThemeSettings = {
    article: {
        highlight: {
            clipboard: true,
            fold: 'unfolded'
        }
    }
};
</script>


    <script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.4/dist/clipboard.min.js" defer></script>



    
    
    
    <script src="/mystudy/js/animation.js"></script>
    

    
    
    
    <script src="https://cdn.jsdelivr.net/npm/lightgallery@1.6.8/dist/js/lightgallery.min.js" defer></script>
    <script src="https://cdn.jsdelivr.net/npm/justifiedGallery@3.7.0/dist/js/jquery.justifiedGallery.min.js" defer></script>
    <script src="/mystudy/js/gallery.js" defer></script>
    

    
    

<div id="outdated">
    <h6>Your browser is out-of-date!</h6>
    <p>Update your browser to view this website correctly. <a id="btnUpdateBrowser" href="http://outdatedbrowser.com/">Update
            my browser now </a></p>
    <p class="last"><a href="#" id="btnCloseUpdateBrowser" title="Close">&times;</a></p>
</div>
<script src="https://cdn.jsdelivr.net/npm/outdatedbrowser@1.1.5/outdatedbrowser/outdatedbrowser.min.js" defer></script>
<script>
    document.addEventListener("DOMContentLoaded", function () {
        outdatedBrowser({
            bgColor: '#f25648',
            color: '#ffffff',
            lowerThan: 'flex'
        });
    });
</script>


    
    
<script src="https://cdn.jsdelivr.net/npm/mathjax@2.7.5/unpacked/MathJax.js?config=TeX-MML-AM_CHTML" defer></script>
<script>
document.addEventListener('DOMContentLoaded', function () {
    MathJax.Hub.Config({
        'HTML-CSS': {
            matchFontHeight: false
        },
        SVG: {
            matchFontHeight: false
        },
        CommonHTML: {
            matchFontHeight: false
        },
        tex2jax: {
            inlineMath: [
                ['$','$'],
                ['\\(','\\)']
            ]
        }
    });
});
</script>

    
    

<a id="back-to-top" title="回到顶端" href="javascript:;">
    <i class="fas fa-chevron-up"></i>
</a>
<script src="/mystudy/js/back-to-top.js" defer></script>


    
    

    
    
    
    

    
    
    
    
    

    


<script src="/mystudy/js/main.js" defer></script>

    
    <div class="searchbox ins-search">
    <div class="searchbox-container ins-search-container">
        <div class="searchbox-input-wrapper">
            <input type="text" class="searchbox-input ins-search-input" placeholder="想要查找什么..." />
            <span class="searchbox-close ins-close ins-selectable"><i class="fa fa-times-circle"></i></span>
        </div>
        <div class="searchbox-result-wrapper ins-section-wrapper">
            <div class="ins-section-container"></div>
        </div>
    </div>
</div>
<script>
    (function (window) {
        var INSIGHT_CONFIG = {
            TRANSLATION: {
                POSTS: '文章',
                PAGES: '页面',
                CATEGORIES: '分类',
                TAGS: '标签',
                UNTITLED: '(无标题)',
            },
            CONTENT_URL: '/mystudy/content.json',
        };
        window.INSIGHT_CONFIG = INSIGHT_CONFIG;
    })(window);
</script>
<script src="/mystudy/js/insight.js" defer></script>
<link rel="stylesheet" href="/mystudy/css/search.css">
<link rel="stylesheet" href="/mystudy/css/insight.css"><!-- hexo-inject:begin --><!-- Begin: Injected MathJax -->
<script type="text/x-mathjax-config">
  MathJax.Hub.Config({"tex2jax":{"inlineMath":[["$","$"],["\\(","\\)"]],"skipTags":["script","noscript","style","textarea","pre","code"],"processEscapes":true},"TeX":{"equationNumbers":{"autoNumber":"AMS"}}});
</script>

<script type="text/x-mathjax-config">
  MathJax.Hub.Queue(function() {
    var all = MathJax.Hub.getAllJax(), i;
    for(i=0; i < all.length; i += 1) {
      all[i].SourceElement().parentNode.className += ' has-jax';
    }
  });
</script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js">
</script>
<!-- End: Injected MathJax -->
<!-- hexo-inject:end -->
    
</body>
</html>